<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>用户登录</title>
    <!-- Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="../static/css/bootstrap.min.css">
    <style>
        /*web background*/
        .container {
            display: table;
            height: 100%;
        }

        .row {
            display: table-cell;
            vertical-align: middle;
        }

        /* centered columns styles */
        .row-centered {
            text-align: center;
        }

        .col-centered {
            display: inline-block;
            border-radius: 20px;
            float: none;
            text-align: left;
            margin-right: -4px;
        }

    </style>
</head>

<body>
<div class="container">
    <div class="row row-centered">
        <div class="well col-md-6 col-centered" style="background: oldlace">
            <h2 class="row-centered" style="color: salmon">FastMQ</h2>
            <br/><br/>
            <form action="/login" method="get" role="form">
                <div class="input-group input-group-md row-centered">
                    <span class="input-group-addon" id="sizing-addon1">
                        <i class="glyphicon glyphicon-user" aria-hidden="true"></i>
                    </span>
                    <input type="text" class="form-control " id="userid" name="userid" placeholder="请输入用户ID"/>
                </div>
                <div class="input-group input-group-md row-centered">
                    <span class="input-group-addon" id="sizing-addon2">
                        <i class="glyphicon glyphicon-lock"></i>
                    </span>
                    <input type="password" class="form-control" id="password" name="password" placeholder="请输入密码"/>
                </div>

                <br/>
                <button type="submit" class="btn btn-success btn-block " style="background: salmon">登录</button>
            </form>
        </div>
    </div>
</div>



<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<!-- <script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script> -->
<script src="../static/js/jquery-3.6.3.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="../static/js/bootstrap.min.js"></script>
</body>
</html>